<%@page pageEncoding="UTF-8" isELIgnored="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="f" uri="http://www.slim3.org/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="m" uri="http://taglibs.mobylet.org/" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<m:charset/>" />
<title>なかまちず</title>
<c:import url="/jsp/pc/keyword.jsp"/>
<link rel="stylesheet" type="text/css" href="/css/global.css" />
<style type="text/css">
  html { overflow: auto; }
  html, body, td, th { font-family: Arial, sans-serif; margin: 0px; padding: 0px; height: 100%; font-size: 10pt; color: #333333; }
  .text { font-family: Arial, sans-serif; margin: 0px; padding: 0px 10px; height: 100%; font-size: 10pt; color: #333333; }
  #map { position: absolute; top: 30px; left: 10px; width: 600px; height: 450px;}
  #map img { cursor: crosshair; }
  img { border: 0px; }
  form { margin: 0; padding: 0; font-family: Arial, sans-serif; font-size: 10pt; }
  input, textarea { margin: 3px 0 0 0; padding: 0; font-family: Arial, sans-serif; font-size: 10pt; }
  #side_bar { position: absolute; top: 6px; left: 620px; border: 1px solid #666; padding: 5px; line-height: 1.8; overflow:auto; background: url(/icon/white70per.png); width: 150px; height: 462px; }
  #header { background-color: #ffffff; position:absolute; top: 6px; left: 10px; z-index: 99; width: 592px; padding: 2px 4px; overflow: hidden; }
  div.errors { color: red; font-weight: bold; position: absolute; top: 35px; left: 15px; border: 1px solid #666; padding: 0px 5px; overflow:auto; background: url(/icon/white70per.png); width: 300px; height: 60px; }
  #main { background-color: #ffffff; font-size: 10pt; position: relative; top: 0px; left: 0px; border: 0px solid #666; }
  #body { background-color: #ffffff; font-size: 10pt; border: 1px solid #666; width: 500px; padding: 2px 4px; margin: 10px;}
  #list { background-color: #ffffff; font-size: 10pt; border: 1px solid #666; width: 500px; padding: 2px 4px; margin: 10px; }
  #help { background-color: #ffffff; font-size: 10pt; width: 759px; height: 120px; padding: 2px 4px; margin: 10px; border: 3px solid #99b3cc; }
  #copy { font-size: 8pt; position: absolute; top: 490px; left: 650px; }
  #footer { font-size: 8pt; position: absolute; top: 950px; left: 10px; }
</style>

<script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>

<script type="text/javascript">
<!--
	$(document).ready(function(){

	});

	function allcheck(bool){

		$(":checkbox").each(function(){
			if(bool){
				$(this).attr("checked", true);
			}else{
				$(this).attr("checked", false);
			}
		});
	}
	
	function addParent(){
		var toListStr = window.opener.document.getElementById("toList").innerHTML;
		$(":checked").each(function(){
			toListStr = toListStr + '<span class="mailAddress" onClick="removeAddress($(this));">' + $(this).val() + '</span>';
		});
		window.opener.document.getElementById("toList").innerHTML = toListStr;
		window.close();
	}
// -->
</script>
</head>
<body>

<c:if test="${!empty errors}">
<p style="font-weight: bold; margin: 10px;">いくつかのエラーが発生しました。下記メッセージを確認してください。</p>
<ul style="color: red; font-weight: bold;">
<c:forEach var="e" items="${f:errors()}">
 <li>${f:h(e)}</li>
</c:forEach>
</ul>
</c:if>

<c:if test="${!empty messages}">
<br/>
<ul style="color: blue; font-weight: bold;">
<c:forEach var="m" items="${messages}">
 <li>${f:h(m)}</li>
</c:forEach>
</ul>
</c:if>



<div id="list"><!-- start list -->

<h1>登録済メンバー選択</h1>
<br/>
<form name="selectMemberForm" action="/memberList" methos="post">
<table>

<c:if test="${!empty memberList}">
 <tr>
  
 </tr>
 <tr>
  <td width="30px">&nbsp;</td>
  <td width="100px"><h2>ニックネーム</h2></td>
  <td width="200px"><h2>メールアドレス</h2></td>
  <td>
  <button type="button" onClick="allcheck(true);">全選択</button>
  <button type="button" onClick="allcheck(false);">全解除</button>
  </td>
 </tr>
<c:forEach var="mem" items="${memberList}" varStatus="status">
 <tr>
  <td align="center">
  ${status.index + 1}
  <input type="checkbox" name="selectMember" value="${mem.mailAddress}"/>
  </td>
  <td>
  <p>${f:h(mem.name)}</p>
  </td>
  <td colspan="2">
  <p>${f:h(mem.mailAddress)}</p>
  </td>
 </tr>
</c:forEach>
 <tr>
  <td colspan="4">
  <p style="margin: 10px;">
  <button type="button" onClick="addParent();">追加する</button>
  </p>
  </td>
 </tr>
</c:if>

<c:if test="${empty memberList}">
 <tr>
  <td>
  追加できるメンバーがいません。
  </td>
 </tr>
</c:if>
</table>

</form>

</div><!-- end list -->

<div style="margin: 10px;">
<button onClick="window.close();">閉じる</button>
</div>


<c:import url="/jsp/pc/analytics.jsp"/>
</body>
</html>